// # CarouselView
// ##author pengguangzong
// 继承slickView组件，图片轮播
//
//
// ## 配置
//
// 变量 | 类型 | required | 描述
// ----|------|----------|-----
// item  | 数组 | true    | 数组元素：str str是图片路径
// lazyLoad | string | false| 是否按需加载，在触发事件时加载图片，ondemand为延时加载
// dots | boolean | false | 是否需要轮播图片的小圆点，小圆点可以切换图片
// swipeToSlide| boolean | false |  是否通过平滑的方式
// autoplay | boolean | false | 是否能够自动播放
// speed       | boolean | false |轮播的切换速度，单位为毫秒
// 例子：
//
// ```js
// {
//   type: "CarouselView",
//   slickOptions: {lazyLoad:'ondemand',dots:true,autoplay:true,swipeToSlide: true,speed:1000},
//   items:[
//   {
//     src: "/runtime/images/56.jpg"
//   },
//   {
//     src: "/runtime/images/uu.jpg"
//   }
//  ]
// }
// ```
////
define([
  './SlickView'
], function(SlickView){

  return SlickView.extend({

    type: 'CarouselView',
    // defaultimage: "",
    slickOptions: {
      lazyLoad: 'ondemand',
      autoplay: true,
      swipeToSlide: true,
      dots: true,
      speed: 300,
      autoplaySpeed: 3000,
      arrows: false,
      prevArrow:'',
      nextArrow:'',
      // adaptiveHeight: true //开启高度自动适配
    },

    initialize: function(options){
      this.title_el = $('<div class="carousel-title"></div>');
      SlickView.prototype.initialize.apply(this, arguments);

    },
    configure:function(options){
      SlickView.prototype.configure.apply(this, arguments);
      var _me = this;
      if (options.items) {
        this.$('.slick-container').on('init',function(event,slick){
          if(options.items[0].description == ''){
            $(_me.el).find('.slick-dots').css({'background-color' : "inherit", 'margin-bottom': '0px'});
            _me.title_el.html('');
          }else{
            $(_me.el).find('.slick-dots').css({'background-color':"#000", 'margin-bottom': '28px'});
            _me.title_el.html(options.items[0].description);
          }
        });
        this.$('.slick-container').on('afterChange',function(event,slick,currentSlide){
          var nextSlide = currentSlide++;
          if(options.items.length == nextSlide){
            nextSlide = 0;
          }
          if(options.items[nextSlide].description == ''){
            $(_me.el).find('.slick-dots').css({'background-color' : "inherit", 'margin-bottom': '0px'});
            _me.title_el.html('');
          }else{
            $(_me.el).find('.slick-dots').css({'background-color':"#000", 'margin-bottom': '28px'});
            _me.title_el.html(options.items[nextSlide].description);
          }
        });
      } else {
        this.title_el.hide();
        if (this.slick) $(this.slick_el).slick('unslick').empty();
      }
    },
    render: function(){
      SlickView.prototype.render.apply(this, arguments);
      this.$el.append(this.title_el);
      return this;
    },
    onDataBind: function(model) {
      this.configure(this.options);
    },

  });

});
